<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:c="http://java.sun.com/jstl/core"
	xmlns:p="http://primefaces.prime.com.tr/ui">

		<h:form id="idEquipamentoXPerifericoMBForm">
				<fieldset id="legend_area"><legend id="legend">
				<h:outputLabel value="#{msg.posicoesDados}" /></legend>
				    <h:panelGrid columns="3">
						<h:panelGroup>
							<br/>
							<h:outputLabel value="#{msg.periferico}" for="idNomeEquipPerif" /><span class="req"> *</span>
						</h:panelGroup>
						<h:panelGroup>
							<rich:message for="idNomeEquipPerif" styleClass="mensagem_erro_campo"/><br/>
							<h:selectOneMenu id="idNomeEquipPerif" value="#{equipamentoXPerifericoMB.equipamentoXPeriferico.periferico}" converter="perifericoConverter">
								<f:selectItems value="#{perifericoMB.perifericoOpts}" />
							</h:selectOneMenu>
						</h:panelGroup>
				    </h:panelGrid>
				</fieldset>

				<h:panelGrid columns="2" width="100%" style="text-align:center;">
					<h:panelGroup>
						<a4j:commandButton value="#{msg.botaoSalvar}"
							action="#{equipamentoXPerifericoMB.save}" reRender="idequipamentoXPerifericoMBForm, perifericoList, mensagens"
							style="text-align:center;" />
						<rich:spacer width="15px" />
						<a4j:commandButton value="#{msg.botaoLimpar}"
							action="#{equipamentoXPerifericoMB.limpar}" reRender="idequipamentoXPerifericoMBForm, mensagens"
							style="text-align:center;" />
					</h:panelGroup>
				</h:panelGrid>
		</h:form>

		<br />
	    <h:form>
			<p:panel>
				<h:commandButton onclick="return confirm('Deseja excluir o registro?')" value="#{msg.excluir}" action="#{equipamentoXPerifericoMB.remove}" reRender="perifericoList"/>
				<p:dataTable id="perifericoList" var="perifericoxequipamento" value="#{equipamentoXPerifericoMB.perifericoList}" paginator="true" rows="15" 
					selection="#{equipamentoXPerifericoMB.perifericoSelectedList}" selectionMode="multiple">
					<p:column sortBy="#{perifericoxequipamento.periferico.codigo}">
						<f:facet name="header">
							<h:outputText value="#{msg.codigo}" />
						</f:facet>
						<h:outputText value="#{perifericoxequipamento.periferico.codigo}" />
					</p:column>

					<p:column sortBy="#{perifericoxequipamento.periferico.nomePeriferico.nome}">
						<f:facet name="header">
							<h:outputText value="#{msg.periferico}" />
						</f:facet>
						<h:outputText value="#{perifericoxequipamento.periferico.nomePeriferico.nome}" />
					</p:column>					
				</p:dataTable>
			</p:panel>
		</h:form>		
</ui:composition>